<template>
	<el-dialog title="新增" :visible.sync="visible" width="600px" :center="false" >
		<div slot="title" class="dialog-header-title">
			<i class="el-icon-lock" style="color: #FFF"></i>&nbsp;
			<span style="color: #FFF">新增菜单</span>
		</div>
		
		<div class="smp-search">
			<el-form :inline="false" label-width="100px" size="mini" ref="form" :model="form" :rules="rules">
				<el-row>
					<el-col :span="24">
						<el-form-item label="菜单名称:" prop="name">
							<el-input v-model="form.name" placeholder="请输入菜单名称"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="24">
					<el-form-item label="菜单类型:" prop="type" >
						<el-select v-model="form.type" style="width: 100%"
							placeholder="菜单类型" >
							<el-option v-for="item in dict('SMP0006')" :key="item.itemCode" :label="item.itemName"
								:value="item.itemCode">
							</el-option>
						</el-select>
					</el-form-item>
					</el-col>
					<el-col :span="24">
						<el-form-item label="菜单路径:" prop="path">
							<el-input v-model="form.path" placeholder="请输入菜单路径"></el-input>
						</el-form-item>
					</el-col>
					
					<el-col :span="24">
						<el-form-item label="菜单排序:" prop="menuOrder" >
							<el-input v-model="form.menuOrder" placeholder="请输入菜单排序"></el-input>
						</el-form-item>
					</el-col>					
					<el-col :span="24">
						<el-form-item label="菜单级别:" prop="level" >
							<el-input v-model="form.level" placeholder="请输入菜单级别"></el-input>
						</el-form-item>
					</el-col>
					
					<el-col :span="24">
						<el-form-item label="父菜单:" prop="parent">
							<el-select v-model="form.parent" style="width: 100%"   placeholder="开发人员">
								<el-option v-for="item in parentList" :key="item.name" :label="item.name" :value="item.name">
									<span style="float: left;margin-left: 3px;">{{ item.name }}</span>
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					
					
					
					
					<el-col :span="24">
						<el-form-item label="状态:" prop="status" >
							<el-select v-model="form.status" style="width: 100%"
								placeholder="状态" >
								<el-option v-for="item in dict('SMP0005')" :key="item.itemCode" :label="item.itemName"
									:value="item.itemCode">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="24">
						<el-form-item label="菜单图标:" prop="icon">
							<el-input v-model="form.icon" placeholder="请输入菜单图标"></el-input>
						</el-form-item>
					</el-col>
					
				</el-row>
			</el-form>
		</div>
		<span slot="footer" class="dialog-footer">
			<el-button type="primary" plain @click="submit" size="mini">
				<i class="el-icon-check"></i>
				确定</el-button>
			<el-button @click="visible = false" size="mini">
				<i class="el-icon-close"></i>
				取消</el-button>
			
		</span>
	</el-dialog>
</template>
<script>
	"use strict";
import {addMenu,getParent} from '@/api/menu.js';
	export default {
		data() {
			return {
				visible: false,
				parentList:[],
				form: {
					name: "",
					path: "",
					parent: "",
					status: "",
					type: "",
					level: "",
					menuOrder: "",
				},
				rules: {
					name: [{
						required: true,
						message: '请输入菜单名称',
						trigger: 'blur'
					}],
					path: [{
						required: true,
						message: '请输入菜单路径',
						trigger: 'blur'
					}],
					type: [{
						required: true,
						message: '请选择菜单类型',
						trigger: 'blur'
					}],
					level: [{
						required: true,
						message: '请输入菜单级别',
						trigger: 'blur'
					}],
					status: [{
						required: true,
						message: '请选择状态',
						trigger: 'blur'
					}],
					menuOrder: [{
						required: true,
						message: '请输入菜单排序',
						trigger: 'blur'
					}],
					icon: [{
						required: true,
						message: '请输入菜单图标',
						trigger: 'blur'
					}],
				}
			}

		},
		created() {
			this.getList();
		},
		methods: {
			ShowDialog() {
				this.visible = true;
			},
			handleCancel(e) {
				this.visible = false;
			},
			submit() {	//新增
			this.$refs["form"].validate((valid)=>{
				if(valid){
					addMenu(this.form).then(response => {
						if(response.data.code == "0000"){
							this.$message.success(response.data.message);
						}else{
							this.$message.error(response.data.message);
						}
						
						
					}).catch(error => {
						this.$message.error(error.message);
					});
					this.visible = false;
					this.$emit("fresh")
				}
			});
			},
			 
			 
			getList(){
			 	getParent().then(response => {
			 		this.parentList = response.data.extend
			 	}).catch(error => {
			 		console.info("失败");
			 		console.info(error.message);
			 	});
			 },
			 
		}
	};
</script>
